<template>
  <div v-loading="loading" class="dataForm">
    <el-form
      ref="form"
      :model="form"
      :rules="rules"
      label-width="120px"
    >
      <el-row>
        <el-col :span="24">
          <el-form-item :label="$t('申请标题')" prop="actTitle">
            <el-input v-model="form.actTitle" :placeholder="$t('申请标题')" show-word-limit :maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('申请人')" prop="applyUser">
            <UserSelect
              v-model="form.applyUser"
              :placeholder="this.$t('选择用户')"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('申请时间')" prop="applyTime">
            <DatePicker
              v-model="form.applyTime"
              :placeholder="$t('申请时间')"
            />

          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('付款金额(元)')" prop="total">
            <Money ref="moneyTotal" v-model="form.total" :placeholder="$t('根据付款明细自动计算')" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('币种')" prop="currency">
            <el-select v-model="form.currency" :placeholder="$t('请选择')">
              <el-option
                v-for="dict in currencyOptions"
                :key="dict.dictValue"
                :label="$t(dict.dictLabel)"
                :value="dict.dictValue"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('主体类型')" prop="type">
            <dictSelect
              v-model="form.type"
              :clearable="true"
              dictionary="main_body_type"
              @change="oneInvestType = form.type; form.investorId = undefined; $forceUpdate()"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('主体名称')" prop="investorId">
            <MainBodySelect
              v-model="form.investorId"
              :parameters="oneInvestType"
              @change="changeInvestorId"
            />
          </el-form-item>
        </el-col>
        <el-col v-show="false" :span="12">
          <el-form-item :label="$t('付款方式')" prop="method">
            <el-radio-group v-model="form.method">
              <el-radio
                v-for="item in methodOptions"
                :key="item.dictValue"
                :label="item.dictValue"
              > {{ $t(item.dictLabel) }}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('紧急级别')" prop="level">
            <el-radio-group v-model="form.level">
              <el-radio
                v-for="item in levelOptions"
                :key="item.dictValue"
                :label="item.dictValue"
              > {{ $t(item.dictLabel) }}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('关联合同')" prop="contractAssociated">
            <div style="display: flex;">
              <el-select v-model="form.contractAssociated" filterable :placeholder="contractMessage" @change="contractChange(form.contractAssociated)">
                <el-option
                  v-for="oaContract in selectDropDownContract"
                  :key="oaContract.id"
                  :label="oaContract.name"
                  :value="oaContract.id"
                />
              </el-select>
              <el-button slot="append" icon="el-icon-view" style="width: auto;" @click="viewContractPage(form.contractAssociated)" />
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('备注')" prop="remark">
            <el-input v-model="form.remark" type="textarea" maxlength="2000" show-word-limit :placeholder="$t('备注')" />
          </el-form-item>
        </el-col>
      </el-row>
      <!--收款方信息-->
      <div class="area-header">
        <span class="area-header-title">{{ $t('收款方信息') }}</span>
      </div>
      <el-row>
        <el-col :span="12">
          <el-form-item :label="$t('收款方名称')" prop="payeeName">
            <!--<el-input v-model="form.payeeName" placeholder="请输入收款方名称" />-->
            <el-autocomplete
              v-model="form.payeeName"
              popper-class="my-autocomplete"
              :fetch-suggestions="querySearch"
              :placeholder="$t('收款方名称')"
              :maxlength="100"
              @select="handleSelect"
            >
              <i slot="suffix" class="el-icon-edit" @click="handleIconClick" />
              <template slot-scope="{ item }">
                <div class="name">{{ item.value }}</div>
                <span class="addr">{{ item.address }}</span>
              </template>
            </el-autocomplete>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('开户行名称')" prop="depositBank">
            <el-input v-model="form.depositBank" :placeholder="$t('开户行名称')" :maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('账户名称')" prop="accountTitle">
            <el-input v-model="form.accountTitle" :placeholder="$t('账户名称')" :maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('银行账号')" prop="bankNumber">
            <el-input v-model="form.bankNumber" :placeholder="$t('银行账号')" :maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('收款方地址')" prop="addressReceiver">
            <el-input v-model="form.addressReceiver" type="textarea" :autosize="{ minRows: 1 }" maxlength="200" :placeholder="$t('收款方地址')" />
          </el-form-item>
        </el-col>

      </el-row>
      <!--费用类型-->
      <div class="area-header">
        <span class="area-header-title">{{ $t('付款明细') }}</span>
      </div>
      <el-table
        :data="form.types"
        border
        class="nowrapTable formTable "
        style="overflow: auto;"
        :summary-method="summaryMethod"
        show-summary
      >
        <el-table-column :label="$t('序号')" align="center" width="50">
          <template slot="header" slot-scope="{}">
            <span>{{ $t('序号') }}</span>
          </template>
          <template slot-scope="scope">
            <el-form-item
              type="index"
              v-html="scope.$index + 1"
            />
          </template>
        </el-table-column>
        <el-table-column :label="$t('费用类型')" align="center" min-width="180px">
          <template slot="header" slot-scope="{}">
            <i style="color: #ff4949;margin-right: 4px;">*</i>
            <span>{{ $t('费用类型') }}</span>
          </template>
          <template slot-scope="scope">
            <el-form-item :prop="'types.' + scope.$index + '.typeArray'" :rules="typesRules.typeArray">
              <el-cascader
                v-model="scope.row.typeArray"
                filterable
                :options="getFdSubjectList"
                clearable
                @change="payTypeChange(scope.$index)"
              >
                <template slot-scope="{ node, data }">
                  <span>{{ $t(data.label) }}</span>
                  <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
                </template>
              </el-cascader>

            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column :label="$t('关联业务数据')" align="center" min-width="180">
          <template slot="header" slot-scope="{}">
            <span class="content" style="text-align: center;">
              <el-tooltip placement="right" :enterable="false" :content="$t('费用类型是项目投资，或者基金运营时选择')">
                <span class="tipText" type="text">
                  {{ $t('关联业务数据') }}
                  <i class="el-icon-question" />
                </span>
              </el-tooltip>
            </span>
          </template>
          <template slot-scope="scope">
            <el-form-item
              v-if="scope.row.subjectType === 'deal' || scope.row.subjectType === 'fund'"
              :prop="'types.' + scope.$index + '.businessId'"
              :rules="typesRules.businessId"
            >
              <MainBodySelect v-model="scope.row.businessId" :show-label="false" :parameters="scope.row.subjectType" />
            </el-form-item>
          </template>
        </el-table-column>
        <!--department 部门-->
        <el-table-column :label="$t('部门')" align="center" min-width="150">
          <template slot="header" slot-scope="{}">
            <span>{{ $t('部门') }}</span>
          </template>
          <template slot-scope="scope">
            <el-form-item :prop="'types.' + scope.$index + '.department'" :rules="typesRules.department">
              <DeptSelect v-model="scope.row.department" />
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column :label="$t('付款金额(元)')" align="center" min-width="140">
          <template slot="header" slot-scope="{}">
            <i style="color: #ff4949;margin-right: 4px;">*</i>
            <span>{{ $t('付款金额(元)') }}</span>
          </template>
          <template slot-scope="scope">
            <el-form-item :prop="'types.' + scope.$index + '.amount'" :rules="typesRules.amount">
              <Money v-model="scope.row.amount" @change="percentageCalculation" />
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column :label="$t('本次付款占比(%)')" align="center" min-width="140">
          <template slot="header" slot-scope="{}">
            <i style="color: #ff4949;margin-right: 4px;">*</i>
            <span>{{ $t('本次付款占比(%)') }}</span>
          </template>
          <template slot-scope="scope">
            <el-form-item :prop="'types.' + scope.$index + '.ratio'" :rules="typesRules.ratio">
              <Ratio v-model="scope.row.ratio" oninput="value=value.replace(/[^\d.]/g,'')" disabled />
            </el-form-item>
          </template>
        </el-table-column>
        <!--
        <el-table-column :label="$t('备注')" align="center" :maxlength="200" min-width="180">
          <template slot-scope="scope">
            <el-form-item prop="remark">
              <el-input v-model="scope.row.remark" :placeholder="$t('备注')" :maxlength="2000" />
            </el-form-item>
          </template>
        </el-table-column>
        -->
        <el-row v-if="form.payCompletionTime !== null && form.payCompletionTime !== '' && form.payCompletionTime !== undefined">
          <!--
          <el-table-column :label="$t('实际付款时间')" align="center" min-width="160">
            <template slot-scope="scope">
              <el-form-item>
                <el-form-item>
                  <DatePicker
                    v-model="scope.row.actualPaymentTime"
                    :disabled="true"
                    :placeholder="$t('实际付款时间')"
                  />
                </el-form-item>
              </el-form-item>
            </template>
          </el-table-column>
          -->
          <el-table-column :label="$t('实际付款金额(元)')" align="center" min-width="150">
            <template slot-scope="scope">
              <Money v-model="scope.row.actualPaymentMoney" :disabled="true" />
            </template>
          </el-table-column>
        </el-row>
        <el-table-column v-if="!otherBtnHide" fixed="right" :label="$t('操作')" align="center">
          <template slot-scope="scope">
            <el-button v-hasPermi="['oa:payment:remove']" size="small" type="text" icon="el-icon-delete" @click="delHandle(scope.$index, scope.row)" />
          </template>
        </el-table-column>
      </el-table>
      <div v-if="!otherBtnHide" class="tol">
        <el-button type="primary" icon="el-icon-plus" size="mini" @click="addPayment">{{ $t("添加") }}</el-button>
      </div>
      <!-- 附件列表 -->
      <FileTable :list.sync="form.fileList" data-type="oa_payment" :business-id="form.businessId" :btn-show="!otherBtnHide" />

      <!--收付款计划-->
      <div v-show="oaContractPayColName === '付款'" v-loading="oaContractPaymentLoading" style="margin-top:15px;">
        <div class="area-header">
          <span class="area-header-title">{{ $t('付款计划') }}</span>
        </div>
        <el-table :data="oaContractPlanList" border class="nowrapTable formTable">
          <el-table-column :label="$t('序号')" align="center" width="50">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('序号') }}</span>
            </template>
            <template slot-scope="scope">
              <el-form-item
                type="index"
                v-html="scope.$index + 1"
              />
            </template>
          </el-table-column>
          <el-table-column label="主体名称" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('主体名称') }}</span>
            </template>
            <template slot-scope="scope">
              {{ scope.row.investName }}
            </template>
          </el-table-column>
          <el-table-column :label="$t('预计付款时间')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('预计付款时间') }}</span>
            </template>
            <template slot-scope="scope">
              {{ parseTime(scope.row.paymentTime) }}
            </template>
          </el-table-column>
          <el-table-column :label="$t('预计付款金额') + $t('金额单位')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('预计付款金额') }}{{ $t('金额单位') }}</span>
            </template>
            <template slot-scope="scope">
              {{ moneyFormat(scope.row.paymentMoney, 'w') }}
            </template>
          </el-table-column>
          <el-table-column :label="$t('币种')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('币种') }}</span>
            </template>
            <template slot-scope="scope">
              {{ currencyFormat(scope.row.currency) }}
            </template>
          </el-table-column>
          <el-table-column :label="$t('备注')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('备注') }}</span>
            </template>
            <template slot-scope="scope">
              {{ scope.row.remark }}
            </template>
          </el-table-column>
        </el-table>
      </div>

      <div v-show="oaContractPayColName === '收款'" v-loading="oaContractPaymentLoading" style="margin-top:15px;">
        <div class="area-header">
          <span class="area-header-title">{{ $t('收款计划') }}</span>
        </div>
        <el-table :data="oaContractPlanList" border class="nowrapTable formTable">
          <el-table-column :label="$t('序号')" align="center" width="50">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('序号') }}</span>
            </template>
            <template slot-scope="scope">
              <el-form-item
                type="index"
                v-html="scope.$index + 1"
              />
            </template>
          </el-table-column>
          <el-table-column :label="$t('主体名称')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('主体名称') }}</span>
            </template>
            <template slot-scope="scope">
              {{ scope.row.investName }}
            </template>
          </el-table-column>
          <el-table-column :label="$t('预计收款时间')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('预计收款时间') }}</span>
            </template>
            <template slot-scope="scope">
              {{ parseTime(scope.row.collectionTime) }}
            </template>
          </el-table-column>
          <el-table-column :label="$t('预计收款金额') + $t('金额单位')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('预计收款金额') }}{{ $t('金额单位') }}</span>
            </template>
            <template slot-scope="scope">
              {{ moneyFormat(scope.row.collectionMoney, 'w') }}
            </template>
          </el-table-column>
          <el-table-column :label="$t('币种')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('币种') }}</span>
            </template>
            <template slot-scope="scope">
              {{ currencyFormat(scope.row.currency) }}
            </template>
          </el-table-column>
          <el-table-column :label="$t('备注')" align="center">
            <template slot="header" slot-scope="{}">
              <span>{{ $t('备注') }}</span>
            </template>
            <template slot-scope="scope">
              {{ scope.row.remark }}
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-form>
    <div slot="footer" class="dialog-footer" style="text-align: right;">
      <FormBtn ref="formBtn" :bus-data="form" has-permi="oa:payment" :btn-hide="btnHide" :menu-key="menuKey" />
    </div>

    <!-- 查看合同流程 -->
    <el-dialog :visible.sync="contractPageLoading" :title="$t('合同详情')" :destroy-on-close="true" custom-class="dialogForm" style=" text-align: left;" append-to-body :close-on-click-modal="false" :lock-scroll="false">
      <ProcessInfoForm ref="processInfoForm" />
    </el-dialog>

    <!-- 收款方历史 -->
    <el-dialog :visible.sync="oaPayeeHistoryOpen" :title="$t('收款方历史')" :destroy-on-close="true" custom-class="folderOpen" style=" text-align: left;" append-to-body :close-on-click-modal="false" :lock-scroll="false" :closed="restaurants = loadAll()">
      <oaPayeeHistoryList ref="oaPayeeHistoryList" />
    </el-dialog>

  </div>
</template>

<script>
  import { saveOaPayment, getOaPayment, getPayeeHistory } from '@/api/oa/payment/oaPayment'
  import { getFdSubjectList } from '@/api/fd/config/getTypeMain'
  import { selectToContract, getOaContractPlanByMainId } from '@/api/oa/contract/oaContract'
  import { deleteOaPaymentDetail } from '@/api/oa/payment/oaPayment'
  import { findInvestMain } from '@/api/deal/contract/dealContract'
  import { moneyFormat } from '@/utils/ruoyi'
  import MainBodySelect from '@/components/MainBodySelect'
  import ProcessInfoForm from '@/views/act/process/processInfoForm'
  import oaPayeeHistoryList from '@/views/oa/payment/oaPaymentHistoryList.vue'
	export default {
    components: {
      MainBodySelect,
      ProcessInfoForm,
      oaPayeeHistoryList
    },
    // props: ['oaPaymentData'],
		data() {
			return {
        // 菜单标识
        menuKey: 'oa_payment',
        // 是否隐藏保存按钮
        btnHide: false,
        // 是否隐藏其它按钮
        otherBtnHide: false,
        subDisabled: true,
        loading: false,
        previewId: '',
        parameters: '',
        // 主体类型
        subjectType: '',
        selectID: '',
				// 表单参数
				form: {
					// 付款主体
					types: [],
					// 附件列表
          fileList: [],
          expenseEntityType1: [],
          expenseEntityType: []
        },
				// 表单校验
				rules: {
          applyUser: [{ required: true, message: this.$t('必填信息'),	trigger: 'change' }],
          applyTime: [{ required: true, message: this.$t('必填信息'),	trigger: 'change' }],
          total: [{ required: true, message: this.$t('必填信息'),	trigger: 'blur' }],
          actTitle: [{ required: true, message: this.$t('必填信息'), trigger: 'blur' }],
          currency: [{ required: true, message: this.$t('必填信息'), trigger: 'change' }],
          payeeName: [{ required: true, message: this.$t('必填信息'),	trigger: 'change' }],
          type: [{ required: true, message: this.$t('必填信息'),	trigger: 'change' }],
          investorId: [{ required: true, message: this.$t('必填信息'),	trigger: 'change' }]
        },
				typesRules: {
					typeArray: [{ required: true, message: this.$t('必填信息'),	trigger: 'change' }],
          amount: [{ required: true, message: this.$t('必填信息'), 	trigger: 'blur' }],
					total: [{ required: true, message: this.$t('必填信息'),	trigger: 'blur' }],
					ratio: [{ required: true, message: this.$t('必填信息'),	trigger: 'change' }]
        },
        typtId: '',
        // 付款币种
        currencyOptions: [],
        // 付款方式
        methodOptions: [],
        // 紧急级别
        levelOptions: [],
        // 付款大类
        getFdSubjectList: [],
        // 合同下拉
        selectDropDownContract: [],
        restaurants: [],
        // 付款类型选择的类型 是否展示 项目等input框
        isShowCascader: '',
        // 合同提示语
        contractMessage: this.$t('请选择合同'),
        oaContractPlanList: [],
        oaContractPaymentLoading: false,
        oaContractPayColName: this.$t('收付款'),
        // 合同查看详情
        contractPageLoading: false,
        oneInvestType: undefined,
        oaPayeeHistoryOpen: false
			}
		},
    computed: {
    },
		watch: {
    },
    mounted() {
      this.restaurants = this.loadAll()
    },
    created() {
      // 付款币种
      this.getDicts('currency').then(response => {
        this.currencyOptions = response.data
      })
      // 付款方式
      this.getDicts('oa_payment_method').then(response => {
        this.methodOptions = response.data
      })
      // 紧急级别
      this.getDicts('oa_level_emergency').then(response => {
        this.levelOptions = response.data
      })

      // 付款大类
      getFdSubjectList('oa_payment').then(response => {
        var data = response.data
        // 国际化
        data.forEach(item => {
          item.label = this.$t(item.label)
          item.children.forEach(item2 => {
            item2.label = this.$t(item2.label)
          })
        })
        this.getFdSubjectList = data
      })

      selectToContract().then(response => {
        const data = response.data
        this.selectDropDownContract = data
      })

      this.$bus.$emit('async_done')
    },
		methods: {
      // 添加付款主体
      addPayment() {
        const row = {
          id: undefined,
          type: '',
          investorId: '',
          amount: 0,
          ratio: '',
          remark: ''
        }
        if (!(this.form.types instanceof Array)) {
          this.$set(this.form, 'types', [])
        }
        this.$nextTick(() => {
          this.form.types.push(row)
        })
      },
      // 币种字典翻译
      currencyFormat(value) {
        return this.selectDictLabel(this.currencyOptions, value)
      },
      // 删除付款主体
      delHandle(index, row) {
        const that = this
        const id = row.id
        if (id !== undefined && id !== '' && id != null) {
          this.$confirm(this.$t('是否确认删除?'), this.$t('警告'), {
            confirmButtonText: this.$t('确定'),
            cancelButtonText: this.$t('取消'),
            type: 'warning'
          }).then(function() {
            return deleteOaPaymentDetail(id).then(response => {
              if (response.code === 200) {
                that.form.types.splice(index, 1)
                that.percentageCalculation()
                return that.msgSuccess(that.$t('删除成功'))
              }
            })
          })
        } else {
          that.form.types.splice(index, 1)
          that.percentageCalculation()
        }
      },
      changeInvestorId(val) {
        this.form.investorId = val
        this.$forceUpdate()
      },
      // 获取明细合计
      summaryMethod() {
        let sum = 0
        this.form.types.forEach(item => {
          sum += +item.amount
        })
        return sum
      },
      // 计算合计是总额
      getSummaries() {
        let sum = 0
        this.form.types.forEach(item => {
          sum += +item.amount
        })
        this.$set(this.form, 'total', sum)
        return sum
      },
      // 初始化数据
      init(data) {
        this.loading = true
        this.oaContractPayColName = ''
        this.contractMessage = this.$t('请选择合同')
        if (!this.isEmpty(data) && !this.isEmpty(data.id)) {
          this.$nextTick(() => {
            getOaPayment(data.id).then(response => {
              this.form = response.data
              const contractAssociated = response.data.contractAssociated
              // 费用类型
              if (this.form.types === null) {
                this.form.types = ''
              }
              for (let i = 0; i < this.form.types.length; i++) {
                const type = this.form.types[i]
                // this.form.types[i].typeArray = [type.typeOne, type.typeTwo]
                const dept = this.form.types[i].department
                this.$set(this.form.types[i], 'typeArray', [])
                this.form.types[i].typeArray.push(type.typeOne)
                this.form.types[i].typeArray.push(type.typeTwo)
                console.log(this.form.types[i].department)
                this.$set(this.form.types[i], 'department', dept)
                console.log(dept)
                // this.$set(this.form.types[i], 'typeArray', [type.typeOne, type.typeTwo])
                this.payTypeChange(i)
              }
              // 页面初始化后会冲掉该值. 加载完最后还原这个值
              this.form.contractAssociated = contractAssociated
              // this.percentageCalculation()
              // 展示合同关联页面
              this.contractChange(this.form.contractAssociated)
              this.loading = false
            })
          })
        } else {
          this.reset()
          this.form.currency = 'CNY'
          this.loading = false
        }
      },
      // 表单重置
      reset() {
        this.form = {
          id: undefined,
          applyUser: this.$store.state.user.userId,
          typeMain: undefined,
          typeArray: undefined,
          currency: undefined,
          method: '0',
          level: '0',
          total: 0,
          applyTime: new Date(),
          department: undefined,
          contractAssociated: undefined,
          payeeName: undefined,
          depositBank: undefined,
          accountTitle: undefined,
          bankNumber: undefined,
          addressReceiver: undefined,
          actTitle: undefined,
          createBy: undefined,
          createTime: undefined,
          updateBy: undefined,
          updateTime: undefined,
          delFlag: undefined,
          remark: undefined,
          businessId: undefined,
          businessType: undefined,
          payCompletionTime: undefined,
          types: [],
          fileList: [],
          getFdSubjectList: []
        }
        this.subjectType = ''
        this.resetForm('form')
      },
      // 取消按钮
      cancel() {
        this.$parent.$parent.formOpen = false
        this.$parent.$parent.reset()
      },
      // 关闭form页面
      closeForm() {
        // 关闭form页面遮罩层
        this.loading = false
        // 关闭form页面
        if (this.$parent.$parent.formOpen !== undefined) {
          this.$parent.$parent.formOpen = false
        }
        // 刷新list页面
        if (this.$parent.$parent.getList !== undefined) {
          this.$parent.$parent.getList()
        }
      },
      /** 提交按钮 */
      submitForm: function(type) {
        return new Promise((resolve, reject) => {
          var temp = this.form.types
          if (temp === null || temp === undefined || temp === '' || temp <= 0) {
            this.msgError(this.$t('至少添加一条付款明细'))
            reject()
          } else {
            this.$refs['form'].validate(valid => {
              if (valid) {
                this.loading = true
                saveOaPayment(this.form).then(response => {
                  if (response.code === 200) {
                    // 设置数据id方式启动流程后取消并再次启动会创建多条记录
                    this.form = response.data
                    if (type === 'process') {
                      this.startProcess(response.data)
                    } else {
                      this.msgSuccess(this.$t('保存成功'))
                      this.closeForm()
                    }
                    resolve()
                  } else {
                    this.msgError(response.msg)
                  }
                }).catch(() => {
                  this.loading = false
                  reject()
                })
              } else {
                this.locationError(document)
                reject()
              }
            })
          }
        })
      },
      // 启动流程
      startProcess: function(data) {
        this.loading = false
        // 启动流程时候传入的参数
        const processData = {}
        // 待办标题
        // const moneys = this.$refs.moneyTotal.unit === 'w' ? this.form.total / 10000 + '万' : this.form.total
        processData.title = this.form.actTitle + '  [  ' + moneyFormat(data.total) + '元' + '  ]'
        // 业务表名
        processData.dataTable = 'oa_payment'
        // 业务ID
        processData.dataId = data.id
        // 业务表单地址
        processData.formPath = '@/views/oa/payment/oaPaymentForm'

        // 业务表单打印地址
        processData.viewPath = '@/views/oa/payment/oaPaymentView'

        // 菜单标识(根据菜单标识判断的走哪个流程)
        processData.menuKey = this.menuKey
        this.startProcessByMenu(processData, () => {
          this.form.actStatus = 'D'
          this.msgSuccess(this.$t('数据保存成功,流程启动成功'))
          this.closeForm()
        })
      },
      // -------------------------------------- 收款方空间控件方法 start(无需修改) --------------------------------------
      querySearch(queryString, cb) {
        var restaurants = this.restaurants
        var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants
        // 调用 callback 返回建议列表的数据
        cb(results)
      },
      createFilter(queryString) {
        return (restaurant) => {
          return (restaurant.value.toLowerCase().includes(queryString.toLowerCase()))
        }
      },
      // -------------------------------------- 收款方控件内置方法 end --------------------------------------
      // 收款方历史提示
      loadAll() {
        var temp = []
        getPayeeHistory().then(reponse => {
          for (var i = 0; i < reponse.data.length; i++) {
            var obj = {
              'value': reponse.data[i].payeeName,
              'address': reponse.data[i].depositBank + '|' + reponse.data[i].accountTitle + '|' + reponse.data[i].bankNumber
            }
            temp.push(obj)
          }
        })
        return temp
      },
      // 收款方选择后触发
      handleSelect(item) {
        this.form.payeeName = item.value
        var arr = item.address.split('|')
        this.form.depositBank = arr[0]
        this.form.accountTitle = arr[1]
        this.form.bankNumber = arr[2]
      },
      // 收款方旁边的小按钮
      handleIconClick() {
        this.oaPayeeHistoryOpen = true
      },
      // 付款类型的onchang时间
      payTypeChange(value) {
        // this.form.contractAssociated = undefined
        this.form.types[value].subjectType = ''
        let vals = this.form.types[value].typeArray
        this.getFdSubjectList.forEach(item => {
          if (vals === undefined) {
            var temp = []
            temp.push('-1')
            vals = temp
          }
          if (item.id === vals[0]) {
            this.form.types[value].subjectType = item.subjectType
            this.form.types[value].businessType = item.subjectType
          }
        })
      },
      schange(value) {
        // this.form.contractAssociated = undefined
        this.form.businessId = value
        // 选择项目后,将该项目下的投资主体自动带出
        if (this.form.id === '' || this.form.id === undefined) {
          if (value !== undefined && value !== '' && value !== null) {
            this.form.types = []
            findInvestMain(value).then(response => {
              response.data.forEach(item => {
                var obj = {
                  type: item.investType == null ? '' : item.investType,
                  investorId: item.investMain == null ? '' : item.investMain
                }
                this.form.types.push(obj)
              })
            })
          }
        }
        // 获取该项目下的合同
        var type = this.form.typeArray[0]
        this.getFdSubjectList.forEach(item => {
          if (item.id === type) {
            type = item.subjectType
          }
        })
      },
      // 计算付款主体的百分比
      percentageCalculation() {
        var temp = 0
        this.form.types.forEach(item => {
          temp += item.amount
        })
        var noLastRatio = 0.0
        this.form.types.forEach((item, index) => {
          var ratioTemp = (item.amount / temp) * 100
          if (isNaN(ratioTemp)) {
            ratioTemp = 0
          }
          item.ratio = ratioTemp.toFixed(4)
          if (this.form.types === null) {
            this.form.types = ''
          }
          if (index === this.form.types.length - 1 && !isNaN(noLastRatio)) {
            if (parseFloat(item.ratio) <= 0) {
              item.ratio = 0
            } else {
              item.ratio = (100.0000 - noLastRatio).toFixed(4)
            }
          } else {
            noLastRatio += parseFloat(item.ratio)
          }
        })
        this.getSummaries()
      },
      // 加载合同下的收付款计划
      contractChange(id) {
        this.oaContractPaymentLoading = true
        this.oaContractPlanList = []
        getOaContractPlanByMainId(id).then(response => {
          if (response.data !== null && response.data.length > 0) {
            var temp = response.data[0].collectionTime
            if (temp === '' || temp === null || temp === undefined) {
              this.oaContractPayColName = '付款'
            } else {
              this.oaContractPayColName = '收款'
            }
          }
          this.oaContractPlanList = response.data
          this.oaContractPaymentLoading = false
        })
      },
      viewContractPage(id) {
        var proArr = this.selectDropDownContract
        if (proArr !== null && proArr !== undefined && proArr !== '') {
          proArr.forEach(item => {
            if (id === item.id) {
              if (item.actId === undefined) {
                id = item.rows.actId
              } else {
                id = item.actId
              }
            }
          })
        }
        if (id !== null && id !== '' && id !== undefined) {
          this.contractPageLoading = true
          this.$nextTick(() => {
            var proData = {}
            proData.actId = id
            this.$refs.processInfoForm.init(proData)
          })
        } else {
          this.msgError(this.$t('请先选择一个合同!'))
        }
      }

    }
	}
</script>
<style scoped>
.el-autocomplete .el-input__icon{
  display: none;
}
</style>
